<!-- author: xuett -->
<!-- date: 2025-07-28 16:38:33 -->
<!-- description: 中转页 -->
<template>
  <div class="transfer-container">
    <div id="loader-wrapper">
      <div id="loader"></div>
      <div class="loader-section section-left"></div>
      <div class="loader-section section-right"></div>
      <div class="load_title">正在加载系统资源，请耐心等待</div>
    </div>
  </div>
</template>

<script setup>
import { getToken } from '@/api/xydz/dissent/index';
import { useUserStore } from '@/store/modules/user';
import { setToken } from '@/utils/auth';
import axios from 'axios';
import { setTitle } from '@/utils/index';

const $route = useRoute();
const $router = useRouter();
const $userStore = useUserStore();

onMounted(async () => {
  let layuiAdmin = localStorage.getItem('layuiAdmin');
  layuiAdmin = layuiAdmin ? JSON.parse(layuiAdmin) : {};

  let params = {};
  // 本地localStorage获取用户信息，未获取到则请求
  if (layuiAdmin) {
    let user_info = layuiAdmin.user_info;
    if (user_info) {
      params.ztCode = user_info.id;
      params.ztName = user_info.realName;
    } else if (layuiAdmin.access_token) {
      user_info = await getUserInfo(layuiAdmin.access_token);
      params.ztCode = user_info.id;
      params.ztName = user_info.realName;
    }
  }
  replaceToken(params);

  // let query = $route.query;
  // let params = {
  //   ztCode: query.orgId,
  //   ztName: query.orgName
  // };
  // replaceToken(params);
});

//获取用户信息
const getUserInfo = (token) => {
  return new Promise((resolve) => {
    axios({
      method: 'get', // 请求方法
      url: '/prod-api/authority/user/me', // 请求URL
      headers: {
        // 自定义请求头
        'Content-Type': 'application/json',
        'Authorization': 'Bearer ' + token
      },
      responseType: 'json' // 响应类型
    }).then((res) => {
      if (res.status == 200 && res.data.code == 0 && res.data.data) {
        let layuiAdmin = localStorage.getItem('layuiAdmin');
        layuiAdmin = layuiAdmin ? JSON.parse(layuiAdmin) : {};
        layuiAdmin.user_info = res.data.data;
        localStorage.setItem('layuiAdmin', JSON.stringify(layuiAdmin));
        resolve(res.data.data);
      }
    });
  });
};

//置换token
const replaceToken = (params) => {
  let query = $route.query;

  let menuName = query.menuName ? query.menuName : 'dissent';
  document.title = menuName == 'daizheng' ? '信用代证综合管理系统' : '转办系统'; //修改系统名称
  localStorage.setItem('menuName', menuName);
  if (params.ztCode && params.ztName) {
    getToken(menuName, {
      'client': 'gxpt',
      ...params
    }).then((res) => {
      if (res.code == 200 && res.data) {
        let token = res.data.token.replace('Bearer ', '');
        setToken(token);
        $userStore.token = token;
        $router.push('/index');
        localStorage.setItem('orgName', params.ztName);
        localStorage.setItem('orgId', params.ztCode);
      } else {
        proxy?.$modal.msgError(res.msg);
      }
    });
  } else {
    console.log('未获取到用户信息');
  }
};
</script>

<style scoped lang="scss">
.transfer-container {
  width: 100%;
  height: 100%;
  #loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;
  }

  #loader {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #fff;
    -webkit-animation: spin 2s linear infinite;
    -ms-animation: spin 2s linear infinite;
    -moz-animation: spin 2s linear infinite;
    -o-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    z-index: 1001;
  }

  #loader:before {
    content: '';
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #fff;
    -webkit-animation: spin 3s linear infinite;
    -moz-animation: spin 3s linear infinite;
    -o-animation: spin 3s linear infinite;
    -ms-animation: spin 3s linear infinite;
    animation: spin 3s linear infinite;
  }

  #loader:after {
    content: '';
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #fff;
    -moz-animation: spin 1.5s linear infinite;
    -o-animation: spin 1.5s linear infinite;
    -ms-animation: spin 1.5s linear infinite;
    -webkit-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
  }

  @-webkit-keyframes spin {
    0% {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
    }

    100% {
      -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }

  @keyframes spin {
    0% {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
    }

    100% {
      -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  #loader-wrapper .loader-section {
    position: fixed;
    top: 0;
    width: 51%;
    height: 100%;
    background: #fff;
    z-index: 1000;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  #loader-wrapper .loader-section.section-left {
    left: 0;
  }

  #loader-wrapper .loader-section.section-right {
    right: 0;
  }
  .loaded #loader-wrapper .loader-section.section-left {
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  }

  .loaded #loader-wrapper .loader-section.section-right {
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  }

  .loaded #loader {
    opacity: 0;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
  }

  .loaded #loader-wrapper {
    visibility: hidden;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: all 0.3s 1s ease-out;
    transition: all 0.3s 1s ease-out;
  }
  .no-js #loader-wrapper {
    display: none;
  }

  .no-js h1 {
    color: #222222;
  }

  #loader-wrapper .load_title {
    font-family: 'Open Sans';
    color: #fff;
    font-size: 19px;
    width: 100%;
    text-align: center;
    z-index: 9999999999999;
    position: absolute;
    top: 60%;
    opacity: 1;
    line-height: 30px;
  }

  #loader-wrapper .load_title span {
    font-weight: normal;
    font-style: italic;
    font-size: 13px;
    color: #fff;
    opacity: 0.5;
  }
}
</style>
